<template>
	<view class="container" style="padding-top: 20rpx;" :class="{'scl-history-page-b':!isA}">
		<view class="article-list-box" v-if="dataList&&dataList.length>0">
			<template v-for="(item,index) in dataList">
				<view v-if="item.sclType == 3" class="alb-item-not-online flex-vc" @click="itemClick(item)">
					<view class="alb-info">
						<view class="alb-title limit-text-single-line">
							{{item.sclName}}
							<view class="live-tip-box" v-if="item.isSclOnLine == 'Y'">已上线</view>
							<view class="tip-box" v-else-if="item.isSclReport == 'N'">
								待上线
							</view>

						</view>
						<view class="alb-content limit-text-single-line">{{item.summary||item.nickName||'暂无'}}</view>
						<view class="tbiip-count">
							{{item.isSclOnLine == 'Y' ? '*已购买测评早鸟票' : '*已购买测评早鸟票，上线后即可测试'}}

							<!-- <image class="tbii-ic-count" src="../../../static/images/scl/test_time.png" mode="">
              </image>{{item.createDateStr}} -->
						</view>
					</view>
					<image class="alb-img" :src="item.coverImg" mode="aspectFill"></image>

				</view>
				<view v-else class="alb-item flex-vc" @click="itemClick(item)">
					<view class="alb-info">
						<view class="alb-title limit-text-single-line">{{item.sclName}}</view>
						<view class="alb-content limit-text-single-line">{{item.summary||item.nickName||'暂无'}}</view>
						<view class="tbiip-count flex-vc" v-if="item.createDate">
							<image class="tbii-ic-count" src="../../../static/images/scl/test_time.png" mode="">
							</image>{{item.createDateStr}}
						</view>
					</view>
					<image class="alb-img" :src="item.coverImg" mode="aspectFill"></image>

					<view class="refund-tip" v-if="item.isUse == 'N'">
						已退款
					</view>
					<view class="not-complete-tip" v-else-if="item.isSclReport == 'N'">
						未测完
					</view>

				</view>
			</template>
		</view>
		<view class="empty-box" v-else>
			<image :src="scl_test_empty" class="eb-img" mode=""></image>
			<view class="eb-text">暂无测评结果</view>
		</view>

	</view>
</template>

<script>
	import {
		ceping_data_list
	} from '@/common/api/scl_api.js'
	import {
		mapState
	} from 'vuex'

	export default {
		components: {

		},
		data() {
			return {
				scl_test_empty: this.imgBaseURL + '/scl/scl_test_empty.png',
				dataList: null,
				// [{
				// 	title: '1',
				// 	sclName: '2',
				// 	coverImg: '../../../static/images/logo.png'
				// }]
				pageNo: 1,
				loadEnd: false,
				staticImgs: {
					activityImg: this.imgBaseURL + '/scl/scl_activity_B.png',
				},

			}
		},
		cmoputed: {
			...mapState({
				currentGroup: state => state.user.currentGroup,
				activitySwitch: state => state.app.activitySwitch
			}),
			isA() {
				return this.currentGroup == 'A'
			},
		},
		onLoad() {
			this.pageNo = 1
			this.getData();
		},
		onReachBottom() {
			if (!this.loadEnd) {
				this.pageNo++;
				this.getData();
			}
		},
		methods: {
			getData() {
				ceping_data_list({
					pageNo: this.pageNo
				}).then(res => {
					if (this.pageNo == 1) {
						this.dataList = this.processData(res.data.data.rows)
					} else {
						if (res.data.data.rows.length == 0) {
							this.loadEnd = true;
						}
						this.dataList = this.dataList.concat(this.processData(res.data.data.rows))
					}

					this.dataList.map(item => {
						item.createDateStr = this.$dayjs(item.createDate).format('YYYY-MM-DD HH:mm')
					})

				})
			},
			processData(rows) {
				const tmpArr = []
				rows.map(item => {
					const tmpObj = JSON.parse(JSON.stringify(item))
					tmpObj.coverImg = tmpObj.coverImg || tmpObj.detailImg
					tmpArr.push(tmpObj)
				})
				return tmpArr
			},
			async checkRedirect(item) {
				const res = await this.$u.api.getSclInfo({
					sclId: item.sclId,
					reportId: item.reportId
				})
				res.data.data = res.data.data || {}
				const {
					scloReportDetail,
					detailInfo
				} = res.data.data || {}

				const tmpObj1 = JSON.parse(scloReportDetail) || {}
				if (tmpObj1.reportRedirect) {

					return tmpObj1.reportRedirect
				}
				const tmpObj2 = JSON.parse(detailInfo) || {}
				if (tmpObj2.redirect) {

					return tmpObj2.redirect
				}
			},
			async itemClick(item) {
				if (this.$fangBaoClick()) return
				console.log(item, '=====item')
				if (item.isUse == 'N') {
					this.$showToast("已退款，无法查看")
				} else if (item.sclType == '5') {
					uni.navigateTo({
						url: '/subcontractorC/pages/sexuality-assessment/index?sourceType=19'
					})
				} else if (item.sclType == '4') {
					uni.navigateTo({
						url: '/subcontractorC/pages/checkupDepressed/index?sourceType=19'
					})
				} else if (item.sclType == '3' && isSclOnLine != 'Y') {
					this.$showToast("请耐心等待上线～")
				} else if (item.sclType == '2') {
					const res = await this.$u.api.getSclInfo({
						sclId: item.sclId,
						reportId: item.reportId
					})
					let detailInfo;
					if (res.data.data.detailInfo) {
						detailInfo = JSON.parse(res.data.data.detailInfo);
					}
					if (detailInfo && detailInfo.isSclAllReport == 'Y') {
						uni.navigateTo({
							url: '/subcontractorB/pages/sclResult/sclResult?id=' + item.reportId +
								'&fromHistory=1'
						})
					} else {
						uni.navigateTo({
							url: '/subcontractorC/pages/sclCheckup/sclCheckup?sourceType=19'
						})
					}

				} else if (item.isSclReport == 'Y') {
					const reportRedirect = await this.checkRedirect(item)
					if (reportRedirect) {
						uni.navigateTo({
							url: '/subcontractorB/pages/sclResult/sclResult?fromHistory=1&showBackBtn=1&id=' +
								item.reportId + '&reportRedirect=' + reportRedirect
						})
						return false
					}
					uni.navigateTo({
						url: '/subcontractorB/pages/sclResult/sclResult?id=' + item.reportId + '&fromHistory=1'
					})
				} else {
					uni.navigateTo({
						url: '/subcontractorD/pages/sclDoQuestion/sclDoQuestion?paramObj=' + JSON.stringify({
							sclId: item.sclId,
							from: 'history'
						})
					})
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	.tbiip-count {
		font-size: 20rpx;
		color: #888888;
		position: absolute;
		left: 0;
		bottom: 0rpx;
	}

	.left-margin {
		left: 80rpx;
	}

	.tbii-ic-count {
		width: 34rpx;
		height: 34rpx;
		margin-right: 10rpx;
	}

	.eb-img {
		width: 518rpx;
		height: 390rpx;
		display: block;
		margin: 0 auto;
	}

	.empty-box {
		padding-top: 318rpx;
	}

	.eb-text {
		width: 100%;
		font-size: 30rpx;
		color: #999999;
		text-align: center;
		margin-top: 30rpx;
	}

	.alb-item-not-online {

		.alb-title {
			display: flex;
			align-items: center;
		}

		.live-tip-box {
			margin-left: 18rpx;

			width: 80rpx;
			height: 28rpx;
			background: linear-gradient(180deg, #FF985B 0%, #FF4F21 100%);
			border-radius: 0rpx 7rpx 0rpx 8rpx;
			// border: 2rpx solid #4D36A5;

			font-family: PingFang-SC, PingFang-SC;
			font-weight: 500;
			font-size: 20rpx;
			color: #FFFFFF;
			line-height: 28rpx;
			text-align: center;
			font-style: normal;
		}

		.tip-box {
			margin-left: 18rpx;

			width: 80rpx;
			height: 28rpx;
			background: linear-gradient(180deg, #FF985B 0%, #FF4F21 100%);
			border-radius: 0rpx 7rpx 0rpx 8rpx;
			// border: 2rpx solid #4D36A5;

			font-family: PingFang-SC, PingFang-SC;
			font-weight: 500;
			font-size: 20rpx;
			color: #FFFFFF;
			line-height: 28rpx;
			text-align: center;
			font-style: normal;


		}

		.tbiip-count {
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #FF8162;
			line-height: 33rpx;
			text-align: left;
			font-style: normal;
		}
	}

	.alb-item,
	.alb-item-not-online {
		width: 686rpx;
		height: 200rpx;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
		position: relative;
	}

	.not-complete-tip {
		position: absolute;
		top: 0;
		left: 0;
		// bottom: 21rpx;

		width: 100rpx;
		height: 37rpx;
		background: #00C195;
		border-radius: 0rpx 19rpx 19rpx 0rpx;

		text-align: center;
		font-size: 24rpx;
		font-family: PingFang-SC-Bold, PingFang-SC;
		font-weight: bold;
		color: #FFFFFF;
	}

	.refund-tip {
		position: absolute;
		top: 0;
		left: 0;

		width: 100rpx;
		height: 37rpx;
		background: #e91e1e;

		border-radius: 0rpx 19rpx 19rpx 0rpx;

		text-align: center;
		font-size: 24rpx;
		font-family: PingFang-SC-Bold, PingFang-SC;
		font-weight: bold;
		color: #fff;
	}

	.alb-info {
		width: 100%;
		height: 158rpx;
		margin-right: 40rpx;
		position: relative;


	}

	.alb-title {
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #1A1B1F;
		line-height: 45rpx;
		text-align: left;
		font-style: normal;

		margin-top: 16rpx;


	}

	.alb-content {
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		color: #666666;
		line-height: 37rpx;
		text-align: left;
		font-style: normal;
		margin-top: 8rpx;
	}

	.alb-img {
		width: 130rpx;
		height: 158rpx;
		border-radius: 20rpx;
		flex-shrink: 0;
	}

	.article-list-box {
		/* width: 686rpx;
		height: 180rpx;
		background: #FFFFFF;
		border-radius: 12rpx;
		margin: 0 auto;
		margin-bottom: 20rpx; */
	}

	.scl-history-page-b {
		background-color: #F6FBFD;
	}

	.container {
		background-color: #F9F9F9;
		box-sizing: border-box;
		padding-bottom: 160rpx;
	}

	.activity-box {
		margin: auto;
		box-sizing: border-box;
		// padding-top: 22rpx;
		display: flex;
		justify-content: center;
		margin-top: 28rpx;
		margin-bottom: 28rpx;

		image {
			width: 686rpx;
			height: 256rpx;
			margin: auto;
			background: #D8D8D8;
			border-radius: 26rpx;
		}
	}
</style>